<template>
 <el-radio-group v-model="defaultValue" :disabled="disabled" size="mini">
     <template v-for="item in options">
        <el-radio-button :key="item.code" :label="item.code" :disabled="item.disabled" >
            <el-tooltip :content="item.name" placement="top" :open-delay="200" :enterable="false">
                <i :class="'iconfont icon-'+item.code"></i>
            </el-tooltip>
        </el-radio-button>
     </template>
      
</el-radio-group>
</template>
<script>
import { getOptionsByCodeType } from '@/utils/getOptionis'
export default {
  name: 'customRadio',
  data() {
    return {
      options: [],
      defaultValue: ''
    }
  },
  props: {
    codeType: {
      type: String,
      required: true
    },
    disabledValues: {
      type: Array
    },
    onlyNeedValues: {
      type: Array
    },
    value: {
      type: String
    },
    disabled: {
      type: Boolean
    }

  },
  methods: {
    handleChange(val) {
      this.$emit('input', val)
    },
    init() {
      getOptionsByCodeType(this.codeType).then(response => {
        const data = response.data.data
        if (data) {
          const tmp = []
          const supportType = []

          data.forEach(element => {
            const elementTmp = element
            elementTmp.disabled = this.disabledValues && this.disabledValues.indexOf(element.code) !== -1
            if (this.onlyNeedValues && this.onlyNeedValues.length > 0) {
              if (this.onlyNeedValues.indexOf(element.code) !== -1) {
                tmp.push(elementTmp)
              }
            } else {
              tmp.push(elementTmp)
            }
            if (elementTmp.disabled === false || !elementTmp.disabled) {
              supportType.push(element)
            }
          })

          this.options = tmp
          if (supportType.length > 0) {
            this.defaultValue = this.value || supportType[0].code
            this.$emit('input', this.defaultValue)
          }
        }
      })
    }
  },
  created() {
    this.defaultValue = this.value
    this.init()
  },
  watch: {
    value() {
      this.defaultValue = this.value
    },
    codeType() {
      this.init()
    },
    defaultValue(val) {
      this.handleChange(val)
    }
  }
}
</script>
